<template>
  <div>
    <el-dialog
      title="填写建议"
      :visible.sync="dialogVisible"
      width="37%"
      append-to-body
      class="dialog-box"
      :close-on-click-modal="false"
    >
      <el-input
        v-model="reason"
        type="textarea"
        placeholder="请输入您的建议"
        maxlength="500"
        show-word-limit
        resize="none"
        rows="10"
      />
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button type="primary" @click="submit">确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { teacherSuggestionsApi } from '@/api/sdutent/Stulist'

export default {
  name: 'AddProposal',
  data() {
    return {
      dialogVisible: false,
      reserveId: '',
      reason: ''
    }
  },
  methods: {
    open(item) {
      this.reason = ''
      this.reserveId = item.id
      this.dialogVisible = true
    },
    submit() {
      if (!this.reason || !this.reason.trim()) {
        this.$message.warning('请填写理由,不能为空')
        return
      }
      const data = {
        id: this.reserveId,
        teacherSuggest: this.reason
      }
      teacherSuggestionsApi(data).then(res => {
        if (res.code === 200) {
          this.$message.success('操作成功')
          this.dialogVisible = false
          this.$emit('submit')
        }
      })
    }
  }
}
</script>

<style scoped lang="scss">
</style>
